import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:love_app/common/su.dart';

class LoveYima extends StatefulWidget {
  @override
  _LoveYimaState createState() => _LoveYimaState();
}

class _LoveYimaState extends State<LoveYima> {
  String firstInputText;
  String secondInputText;
  String thirdInputText;
  List<Widget> monthData = [];
  List<Widget> days = [];

  @override
  void initState() {
    super.initState();
    firstInputText = '';
    secondInputText = '';
    thirdInputText = '';
    for (int i = 25; i < 36; i++) {
      monthData.add(Text(i.toString()));
    }
    for (int i = 3; i < 7; i++) {
      days.add(Text(i.toString()));
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: Su().appBar('姨妈助手'),
      body: Column(
        children: <Widget>[
          _font(),
          _input(),
          _button(),
        ],
      ),
    );
  }

  // 每一个input的边框
  var inputBorder = Border.all(
    color: Color.fromRGBO(224, 224, 224, 1),
    width: ScreenUtil().setHeight(1),
  );

  // 提醒文字
  Widget _font() {
    return Container(
      alignment: Alignment.centerLeft,
      margin: EdgeInsets.only(
        top: ScreenUtil().setHeight(36),
      ),
      padding: EdgeInsets.only(
        left: ScreenUtil().setWidth(33),
      ),
      child: Text(
        '当姨妈来时，你会第一时间收到通知哦',
        style: Su().textStyle(Color.fromRGBO(38, 38, 38, 1), 28),
      ),
    );
  }

  // 提交按钮
  Widget _button() {
    return Container(
      margin: EdgeInsets.only(
        top: ScreenUtil().setHeight(60),
      ),
      height: ScreenUtil().setHeight(82),
      width: ScreenUtil().setWidth(664),
      decoration: BoxDecoration(
        color: Color.fromRGBO(233, 140, 166, 1),
        border: Border.all(
          width: ScreenUtil().setWidth(1),
          color: Color.fromRGBO(251, 92, 170, 1),
        ),
        borderRadius: BorderRadius.all(Radius.circular(14)),
      ),
      child: Center(
        child: Text(
          '开通',
          textAlign: TextAlign.center,
          style: Su().textStyle(Colors.white, 36),
        ),
      ),
    );
  }

  // 输入框
  Widget _input() {
    return Container(
      margin: EdgeInsets.only(top: ScreenUtil().setHeight(43)),
      height: ScreenUtil().setHeight(265),
      child: Column(
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[
          _firstInput(),
          _secondInput(),
          _thirdInput(),
        ],
      ),
    );
  }

  // 第一行输入框， 最后一次来姨妈
  Widget _firstInput() {
    return Container(
      decoration: BoxDecoration(border: inputBorder, color: Colors.white),
      height: ScreenUtil().setHeight(88),
      child: InkWell(
        onTap: () async {
          await _showFirstModalBottomSheet();
        },
        child: Row(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.only(
                left: ScreenUtil().setWidth(45),
                right: ScreenUtil().setWidth(22),
              ),
              child: Image.asset(
                'images/more_page/shuidi.png',
                // width: ScreenUtil().setWidth(21),
                height: ScreenUtil().setHeight(21),
              ),
            ),
            Text(
              '最后一次来姨妈',
              style: Su().textStyle(Color.fromRGBO(38, 38, 38, 1), 27.98),
            ),
            Expanded(
              child: Padding(
                padding: EdgeInsets.only(
                  right: ScreenUtil().setWidth(44),
                ),
                child: Text(
                  firstInputText,
                  textAlign: TextAlign.end,
                  style: Su().textStyle(Color.fromRGBO(238, 135, 176, 1), 25.98),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 第二行 姨妈周期
  Widget _secondInput() {
    return Container(
      decoration: BoxDecoration(border: inputBorder, color: Colors.white),
      height: ScreenUtil().setHeight(88),
      child: InkWell(
        onTap: () async {
          await _showSecondModalBottomSheet();
        },
        child: Row(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.only(
                left: ScreenUtil().setWidth(45),
                right: ScreenUtil().setWidth(22),
              ),
              child: Image.asset(
                'images/more_page/shuidi.png',
                height: ScreenUtil().setHeight(21),
              ),
            ),
            Text(
              '姨妈周期',
              style: Su().textStyle(Color.fromRGBO(38, 38, 38, 1), 27.98),
            ),
            Expanded(
              child: Padding(
                padding: EdgeInsets.only(
                  right: ScreenUtil().setWidth(44),
                ),
                child: Text(
                  secondInputText,
                  textAlign: TextAlign.end,
                  style: Su().textStyle(Color.fromRGBO(238, 135, 176, 1), 25.98),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 第三行 姨妈时长
  Widget _thirdInput() {
    return Container(
      decoration: BoxDecoration(border: inputBorder, color: Colors.white),
      height: ScreenUtil().setHeight(88),
      child: InkWell(
        onTap: () async {
          await _showThirddModalBottomSheet();
        },
        child: Row(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.only(
                left: ScreenUtil().setWidth(45),
                right: ScreenUtil().setWidth(22),
              ),
              child: Image.asset(
                'images/more_page/shichang.png',
                height: ScreenUtil().setHeight(21),
              ),
            ),
            Text(
              '姨妈时长',
              style: Su().textStyle(Color.fromRGBO(38, 38, 38, 1), 27.98),
            ),
            Expanded(
              child: Padding(
                padding: EdgeInsets.only(
                  right: ScreenUtil().setWidth(44),
                ),
                child: Text(
                  thirdInputText,
                  textAlign: TextAlign.end,
                  style: Su().textStyle(Color.fromRGBO(238, 135, 176, 1), 25.98),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 最后一次来姨妈 弹出底部菜单
  Future<int> _showFirstModalBottomSheet() {
    DateTime date = DateTime.now();
    setState(() {
      firstInputText = "${date.year}-${date.month}-${date.day}";
    });
    return showModalBottomSheet<int>(
      context: context,
      builder: (BuildContext context) {
        return Container(
          height: ScreenUtil().setHeight(373),
          child: Column(
            children: <Widget>[
              _showTitle('first', '最后一次来姨妈'),
              Container(
                height: ScreenUtil().setHeight(301),
                child: CupertinoDatePicker(
                  onDateTimeChanged: (DateTime date) {
                    // setState(() {
                    //   firstInputText = "${date.year}-${date.month}-${date.day}";
                    // });
                    Su.suPrints(date, msg: "哈哈哈哈哈哈哈哈");
                  },
                  initialDateTime: DateTime.now(),
                  mode: CupertinoDatePickerMode.date,
                ),
              ),
            ],
          ),
        );
      },
    );
  }

  // 姨妈周期 弹出底部菜单
  Future<int> _showSecondModalBottomSheet() {
    setState(() {
      // secondInputText = secondInputText == '' ? '25' : secondInputText;
      secondInputText = '25';
    });
    return showModalBottomSheet<int>(
      context: context,
      builder: (BuildContext context) {
        return Container(
            height: ScreenUtil().setHeight(373),
            child: Column(
              children: <Widget>[
                _showTitle('second', '姨妈周期'),
                Container(
                  height: ScreenUtil().setHeight(301),
                  child: CupertinoPicker(
                    backgroundColor: Colors.white,
                    onSelectedItemChanged: (int index) {
                      var day = monthData[index] as Text;
                      setState(() {
                        secondInputText = day.data;
                      });
                    },
                    children: monthData,
                    itemExtent: ScreenUtil().setHeight(50),
                  ),
                ),
              ],
            ));
      },
    );
  }

  // 姨妈时长 弹出底部菜单
  Future<int> _showThirddModalBottomSheet() {
    setState(() {
      // secondInputText = secondInputText == '' ? '25' : secondInputText;
      thirdInputText = '3';
    });
    return showModalBottomSheet<int>(
      context: context,
      builder: (BuildContext context) {
        return Container(
            height: ScreenUtil().setHeight(373),
            child: Column(
              children: <Widget>[
                _showTitle('third', '姨妈时长'),
                Container(
                  height: ScreenUtil().setHeight(301),
                  child: CupertinoPicker(
                    backgroundColor: Colors.white,
                    onSelectedItemChanged: (int index) {
                      var day = days[index] as Text;
                      setState(() {
                        thirdInputText = day.data;
                      });
                    },
                    children: days,
                    itemExtent: ScreenUtil().setHeight(50),
                  ),
                ),
              ],
            ));
      },
    );
  }

  // 弹出框的头部
  Widget _showTitle(String data, String titleText) {
    return Container(
      height: ScreenUtil().setHeight(72),
      color: Color.fromRGBO(238, 135, 176, 1),
      child: Row(
        children: <Widget>[
          IconButton(
            icon: Icon(
              Icons.remove,
              color: Colors.white,
            ),
            onPressed: () {
              setState(() {
                if (data == 'first') {
                  firstInputText = '';
                }
                if (data == 'second') {
                  secondInputText = '';
                }
                if (data == 'third') {
                  thirdInputText = '';
                }
              });
              Navigator.of(context).pop();
            },
          ),
          Expanded(
            child: Text(
              titleText,
              textAlign: TextAlign.center,
              style: Su().textStyle(Colors.white, 30),
            ),
          ),
          IconButton(
            icon: Icon(
              Icons.add,
              color: Colors.white,
            ),
            onPressed: () async {
              if (firstInputText.length < 1) {
                await _displayShow();
              } else {
                setState(() {
                  Navigator.of(context).pop();
                });
              }
            },
          ),
        ],
      ),
    );
  }

  // 弹出没有选择日期的对话框
  Future<bool> _displayShow() {
    return showDialog<bool>(
      context: context,
      builder: (context) {
        return CupertinoAlertDialog(
          title: Text('请选择日期'),
          actions: <Widget>[
            CupertinoDialogAction(
              child: Text('好的'),
              onPressed: () {
                Navigator.of(context).pop();
              },
            ),
          ],
        );
      },
    );
  }
}


// import 'package:flutter/material.dart';

// class LoveYima extends StatefulWidget {
//   @override
//   _LoveYimaState createState() => _LoveYimaState();
// }

// class _LoveYimaState extends State<LoveYima> {

//   @override
//   void initState() {
//     // TODO: implement initState
//     super.initState();
//   }

//   @override
//   Widget build(BuildContext context) {
//     return Container(
      
//     );
//   }
// }